<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<%@include file="/views/common/include/taglib.jsp"%>
<script src="${ctx}/js/controllers/property/feebill/payBill.js"
	type="text/javascript"></script>
<link rel="stylesheet" href="${ctx}/css/page/header2.css"
	type="text/css">
<link rel="stylesheet" href="${ctx}/css/page/reset.css" type="text/css">
<link rel="stylesheet" href="${ctx}/css/page/leftList.css"
	type="text/css">
<link rel="stylesheet" href="${ctx}/css/page/jiaofei.css"
	type="text/css">
<link rel="stylesheet" href="${ctx}/css/page/footer.css" type="text/css">
<style type="text/css">
tr {
    border:1px solid #ccc;
}
</style>
</head>
<body>
	<script type="text/javascript">
		var ctx = '${ctx}';
	</script>
	<div id="first">
		<div class="nav-list">
			<ul>
				<li onclick="goToMyBill();"><img src="${ctx }/images/wuye/wy3.png" />我的账单
					<div class="bottom-box "></div></li>
				<li onclick="gotoPayBill();"><img src="${ctx }/images/wuye/wy2.png" />我要缴费
					<div class="bottom-box "></div></li>
				<li onclick="gotoBillRecords();"><img src="${ctx }/images/wuye/wy4.png" />缴费记录
					<div id="show-box" class="bottom-box"></div></li>
			</ul>
		</div>
		<div class="payment-record payment-info-box">
			<div class="bill-record-content">
				<table id="table_list" class="record-table">
					<thead class="record-table-head">
						<tr>
							<th>房屋</th>
							<th>缴费类型</th>
							<th>费用</th>
							<th>状态</th>
						</tr>
					</thead>
					<c:forEach items="${feeBillList}" var="config"
						varStatus="configStatus">
						<tbody id="tableTbody" class="record-tbody">
						<tr style="height:20px;"></tr>
							<tr class="record-head">
								<td>账单号：${config.id}</td>
								<td></td>
								<td></td>
								<td><span>缴费时间：${config.payTimeString}</span></td>
							</tr>
							<tr class="record-body">
								<td><img style="vertical-align: -3px;" src="${ctx }/images/wuye/wy4.png"> <span>${config.houseFullName}</span>
								</td>
								<td>物业费</td>
								<td>￥${config.money}元</td>
								<td>
									<p>已支付</p>
									<p style="color:#fd7c66;cursor: pointer;" onclick="gotoBillDetail('${config.id}');">查看详情</p>
								</td>
							</tr>
						</tbody>
					</c:forEach>
				</table>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function goToMyBill() {
			parent.window.location.href = ctx + "/propertyBill/getMyBill";
		}
		function gotoPayBill() {
			$('#first').load(ctx+"/propertyBill/getPayBillInfo");
		}
		function gotoBillRecords() {
			$('#first').load(ctx+"/propertyBill/propertyFeePaymentList");
		}
		function gotoBillDetail(billID) {
			$('#first').load(ctx + "/propertyBill/propertyFeePaymentDetail?billID="+billID);
		}
	</script>
</body>
</html>